<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <title>新闻管理系统 - 重置密码</title>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome CDN -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <!-- Font Awesome 本地备份 -->
    <link rel="stylesheet" href="css/fontawesome.min.css">
    <!-- 自定义CSS -->
    <link rel="stylesheet" href="css/style.css">
    <!-- jQuery -->
    <script src="js/jquery.min.js"></script>
    <!-- Bootstrap JS -->
    <script src="bootstrap/js/bootstrap.min.js"></script>
</head>
<body class="bg-light">
    <div class="container">
        <div class="row justify-content-center mt-5">
            <div class="col-md-6 col-lg-4">
                <div class="card shadow-lg">
                    <div class="card-body p-5">
                        <div class="text-center mb-4">
                            <i class="fas fa-key fa-3x text-danger mb-3"></i>
                            <h2 class="text-danger">重置密码</h2>
                        </div>
                        <%-- 显示错误信息 --%>
                        <% String message = (String)request.getAttribute("message");
                            if(message != null && !message.isEmpty()) { %>
                        <div class="alert alert-danger" role="alert">
                            <i class="fas fa-exclamation-circle me-2"></i>
                            <%= message %>
                        </div>
                        <% } %>
                        <form id="resetForm" action="resetPasswordServlet" method="post">
                            <div class="form-group mb-3">
                                <label for="username" class="form-label">
                                    <i class="fas fa-user me-2"></i>用户名
                                </label>
                                <input type="text" class="form-control" id="username" name="username" required>
                                <div class="invalid-feedback">请输入用户名</div>
                            </div>
                            
                            <div class="form-group mb-3">
                                <label for="newPassword" class="form-label">
                                    <i class="fas fa-lock me-2"></i>新密码
                                </label>
                                <input type="password" class="form-control" id="newPassword" name="newPassword" required>
                                <div class="invalid-feedback">请输入新密码</div>
                            </div>
                            
                            <div class="form-group mb-4">
                                <label for="confirmPassword" class="form-label">
                                    <i class="fas fa-lock me-2"></i>确认新密码
                                </label>
                                <input type="password" class="form-control" id="confirmPassword" name="confirmPassword" required>
                                <div class="invalid-feedback">两次输入的密码不一致</div>
                            </div>
                            
                            <button type="submit" class="btn btn-danger w-100 mb-3">
                                <i class="fas fa-key me-2"></i>重置密码
                            </button>
                            
                            <div class="text-center">
                                <a href="login.jsp" class="text-decoration-none">
                                    <i class="fas fa-arrow-left me-1"></i>返回登录
                                </a>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        $(document).ready(function() {
            // 表单验证
            $('#resetForm').on('submit', function(e) {
                let isValid = true;
                
                // 验证密码匹配
                if ($('#newPassword').val() !== $('#confirmPassword').val()) {
                    $('#confirmPassword').addClass('is-invalid');
                    isValid = false;
                } else {
                    $('#confirmPassword').removeClass('is-invalid');
                }
                
                if (!isValid) {
                    e.preventDefault();
                }
            });
            
            // 输入框获得焦点时移除错误提示
            $('.form-control').on('focus', function() {
                $(this).removeClass('is-invalid');
            });
        });
    </script>
</body>
</html> 